<template>

  <div>
    <el-row>
      <el-button type="primary" size="small">添加用户</el-button>
      <el-button type="danger" size="small">删除用户</el-button>
      <el-button type="success" size="small" @click="exportusers">导出用户</el-button>
    </el-row>
    <el-row>
      <el-table border :data="users" style="margin-top: 5px">
          <el-table-column prop="name" label="用户名"></el-table-column>
          <el-table-column prop="age" label="年龄"></el-table-column>
        <el-table-column prop="hobby" label="兴趣爱好"></el-table-column>
        <el-table-column prop="birthday" label="生日" :formatter="formatdate"></el-table-column>

      </el-table>
          <el-pagination @size-change="sizeChangeHandler" @current-change="currentChangeHandler" :current-page="pageinfo.cpage" :page-sizes="[3,5,10,20]" :page-size="pageinfo.row" layout="total, sizes, prev, pager, next, jumper" :total="pageinfo.total"></el-pagination>
    </el-row>
  </div>

</template>

<script>

  import axios from "axios"
  export default {
    name: "UserList",
    data() {
      return {
        users:[],
        pageinfo:{
          cpage:1,
          row:3,
          total:10
        }
      }
    },
    mounted(){
      //去后台加载数据
      var that =this;
      axios.get("/eq/user").then(function (response) {
        that.users=response.data;
      }).catch(function (ex) {
        //处理异常
      });

    },
    methods:{
      formatdate(row, column, value, index) {
        var date = new Date(value);
        return date.getFullYear() + "-" + (1 + date.getMonth()) + "-" + date.getDate()
//        return "2019-08-19"
      },
      exportusers(){
        window.location="/eq/user/export"
      },
      sizeChangeHandler(size){
        this.row=size;
        var that=this;
        axios.get("/eq/user",{
          params:{
            row:that.row,
            cpage:that.cpage
          }
        }).then(function (response){
          that.users=response.data;
        }).catch(function (ex) {
          //处理异常

        })

      },
      currentChangeHandler(current){
        this.cpage = current;
        var that = this;
        axios.get("/eq/user", {
            params: {
              row: that.row,
              cpage: that.cpage
            }
          }
        ).then(function (response) {
          that.users = response.data;
        }).catch(function (ex) {
          //处理异常
        });
      }
    }
  }

</script>
<style>

</style>
